<template>
  <div class="Header">
    <x-header :left-options="{backText: ''}">{{title}}</x-header>
  </div>
</template>

<script>
  import {XHeader} from 'vux'

  export default {
    name: 'Header',
    props: {
      title: ''
    },
    components: {
      XHeader
    }
  }
</script>

<style lang="less" type="text/less">
  .Header {
    .vux-header {
      background: #fff;
      position: fixed;
      z-index: 10;
      width: 100%;
      padding: 0;
      top: 0;
      .vux-header-title {
        color: #000;
        font-size: 16px;
        font-weight: 600;
      }
      .vux-header-left {
        .left-arrow {
          top: -7px;
          &:before {
            border-color: #000;
            border-width: 1px 0 0 1px;
            width: 10px;
            height: 10px;
          }
        }
      }
    }
  }

</style>
